<template>
  <view class="card" @click="clickCrad">
    <view class="card_top">
      <view>{{ info.role_name }} - {{ info.user_login }}</view>
      <view>
        <view>
          <text>余额：</text>
          <text class="textBlack">{{ info.cash ? info.cash : 0 }}元</text>
        </view>
        <view>
          <text>用户分成：</text>
          <text class="textBlack">{{ info.per ? (info.per*1)+'%' : "0%" }}</text>
        </view>
      </view>
      <view>
        <view>
          <text>状态：</text>
          <text class="textBlack">{{ info.user_status_text || "正常" }}</text>
        </view>
        <view>
          <text>微信号：</text>
          <text class="textBlack">{{
            info.wx_user.nickname ? info.wx_user.nickname : "未绑定"
          }}</text>
        </view>
      </view>
    </view>
    <view class="card_btn flexRowBetween">
      <BaseButton
        type="default"
        width="190"
        shape="circle"
        @onClick.stop="enableUser"
      >
        {{ isEnableStatus ? "启用" : "禁用" }}
      </BaseButton>
      <BaseButton
        type="default"
        width="190"
        shape="circle"
        @onClick.stop="bindWx"
      >
        {{ isBindWx ? "微信解绑" : "微信绑定" }}
      </BaseButton>
      <BaseButton
        type="default"
        width="190"
        shape="circle"
        @onClick.stop="setDivide"
        >设置分成</BaseButton
      >
    </view>
  </view>
</template>

<script>
import BaseButton from "../../../components/base/BaseButton.vue";
export default {
  components: { BaseButton },
  name: "UserListCard",
  props: {
    info: { type: Object, default: {} },
  },
  computed: {
    isEnableStatus() {
      let status = this.info.user_status;
      if (status == 0 || status == 2) {
        return true;
      }
      return false;
    },
    isBindWx() {
      return this.info.openid ? true : false;
    },
  },
  methods: {
    setDivide() {
      this.$emit("setDivide");
    },
    enableUser() {
      this.$emit("enableUser");
    },
    bindWx() {
      this.$emit("bindWx");
    },
    clickCrad() {
      this.$emit("clickCrad");
    },
  },
};
</script>

<style lang="scss" scoped>
.card {
  &_top {
    > view {
      margin-bottom: 24rpx;
      display: flex;
      justify-content: space-between;
      &:first-child {
        color: $textBlack;
        font-size: $font-size-middle;
        font-weight: bold;
      }
      .textBlack {
        color: $textBlack;
      }
    }
  }
}
</style>